<!DOCTYPE html>
<html>
<head>
    <title>第一章:JavaScript基本语法</title>

    <meta charset="UTF-8"/>

    <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>

    <meta name="HandheldFriendly" content="true"/>

    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>

    <meta name="apple-mobile-web-app-capable" content="yes"/>

    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>

    <link href="./asset/gitbook/style.css" type="text/css" rel="stylesheet"/>
    <link href="./asset/gitbook/istyle.css" type="text/css" rel="stylesheet"/>

    <style type="text/css">
        
            span.md_line{margin-bottom:0.5em; display:block; line-height:1.89}
            .md_line br{ display: none;}
            
    </style>

    <script>
        var flowchat_options = {
            'x': 0, 'y': 0, 'line-width': 1, 'line-length': 50, 'text-margin': 10, 'font-size': 13,
            'font-color': '#3c3c3c', 'line-color': '#666666', 'element-color': '#666666', 'fill': 'transparent',
            'yes-text': 'yes', 'no-text': 'no', 'arrow-end': 'block', 'class': 'flowchart', 'scale': 1,
            'symbols': { 'start': {}, 'end': {}, 'condition': {}, 'inputoutput': {}, 'operation': {}, 'subroutine': {}}
        }
    </script>
    <script type="text/javascript" src="./asset/other/raphael-min.js"></script>
    <script type="text/javascript" src="./asset/other/flowchart.js"></script>
    <script type="text/javascript" src="./asset/other/echarts.min.js"></script>


</head>

<body>





<div data-basepath="/service/gitbook" class="book">
    <div class="book-summary">
        <ul class="summary">
            <li>
                <a href="./index.html">笔记</a>
            </li>
            <li class="divider"></li>
            
                
                
    
    <li data-level="1" class="chapter active" data-path="01_JavaScript基本语法.html">
        
        
        <a href="./01_JavaScript基本语法.html" ><b>1</b> 第一章:JavaScript基本语法</a>
        
            
                    
                
        
    </li>

            
                
                
    
    <li data-level="2" class="chapter" data-path="02_函数与window对象.html">
        
        
        <a href="./02_函数与window对象.html" ><b>2</b> 第二章_函数与window对象</a>
        
            
                    
                
        
    </li>

            
                
                
    
    <li data-level="3" class="chapter" data-path="03_DOM编程.html">
        
        
        <a href="./03_DOM编程.html" ><b>3</b> 03_DOM编程</a>
        
            
                    
                
        
    </li>

            
                
                
    
    <li data-level="4" class="chapter" data-path="04_DOM高级编程.html">
        
        
        <a href="./04_DOM高级编程.html" ><b>4</b> 04_DOM高级编程</a>
        
            
                    
                
        
    </li>

            
                
                
    
    <li data-level="5" class="chapter" data-path="05_控制CSS样式.html">
        
        
        <a href="./05_控制CSS样式.html" ><b>5</b> 05_控制CSS样式</a>
        
            
                    
                
        
    </li>

            
                
                
    
    <li data-level="6" class="chapter" data-path="06_表单验证及操作基础.html">
        
        
        <a href="./06_表单验证及操作基础.html" ><b>6</b> 06_表单验证及操作基础</a>
        
            
                    
                
        
    </li>

            
        </ul>

    </div>

    <div class="book-body">
        <div class="body-inner">

            <div class="book-header" role="navigation">
                <h1>
                    <a href="./index.html" > 笔记</a>
                </h1>
            </div>

            <div tabindex="-1" class="page-wrapper">
                <div class="page-inner">
                    <h2 class="post_title"> 第一章:JavaScript基本语法 </h2>
                    <div class="post_body"> <p class="md_block">

<div class="toc"><ul>
<li>
<a href="#toc_0">第一章:JavaScript基本语法</a>
<ul>
<li>
<a href="#toc_1">script标签 - 天天会用</a>
</li>
<li>
<a href="#toc_2">语法</a>
<ul>
<li>
<a href="#toc_3">标识符 - 重点,要能随时背出来</a>
</li>
<li>
<a href="#toc_4">注释 - 重点</a>
</li>
<li>
<a href="#toc_5">变量 - 重点</a>
</li>
<li>
<a href="#toc_6">变量无类型,可以随意赋任意类型的值</a>
</li>
<li>
<a href="#toc_7">数据类型 - 理解</a>
</li>
<li>
<a href="#toc_8">typeof操作符 - 撑握</a>
</li>
<li>
<a href="#toc_9">语言赋值特点</a>
</li>
<li>
<a href="#toc_10">数据类型转换</a>
</li>
</ul>
</li>
<li>
<a href="#toc_11">运算符</a>
<ul>
<li>
<a href="#toc_12">算术运算符</a>
</li>
<li>
<a href="#toc_13">赋值运算符</a>
</li>
<li>
<a href="#toc_14">比较(关系)运算符</a>
</li>
<li>
<a href="#toc_15">逻辑运算符</a>
</li>
</ul>
</li>
<li>
<a href="#toc_16">运算符综合实例(写一个简单计算器)</a>
</li>
<li>
<a href="#toc_17">if条件结构</a>
</li>
<li>
<a href="#toc_18">循环语句</a>
</li>
<li>
<a href="#toc_19">函数</a>
</li>
<li>
<a href="#toc_20">常用系统函数</a>
<ul>
<li>
<a href="#toc_21">数组</a>
</li>
</ul>
</li>
<li>
<a href="#toc_22">对象</a>
</li>
<li>
<a href="#toc_23">课件练习:输出三角形</a>
</li>
<li>
<a href="#toc_24">使用火狐自带的开发者工具进行调试.</a>
</li>
</ul>
</li>
</ul>
</div>
</p>


<h2 id="toc_1">script标签 - 天天会用</h2>

<p class="md_block">
    <span class="md_line">基本格式</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span>        <span class="o">&lt;</span><span class="nx">script</span> <span class="nx">type</span><span class="o">=</span><span class="s2">&quot;text/javascript&quot;</span><span class="o">&gt;</span>
             <span class="c1">//运行时机:在什么时候运行</span>
            <span class="c1">//把这个script标签放在哪,它就在哪执行,可以放在html文件的任意位置.</span>
            <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;弹窗的HelloWorld!&quot;</span><span class="p">);</span>
        <span class="o">&lt;</span><span class="err">/script&gt;</span>
        <span class="c">&lt;!--</span><span class="nx">如果浏览器不支持或关闭了脚本功能则执行noscript标签中内内容</span><span class="p">,</span><span class="nx">如果浏览器支持或开启了此功能</span><span class="p">,</span><span class="nx">则noscript标签内容不会被执行</span><span class="o">--&gt;</span>
        <span class="o">&lt;</span><span class="nx">noscript</span><span class="o">&gt;</span>
            <span class="nx">必须开启你的浏览器javascript功能</span><span class="o">!</span>
        <span class="o">&lt;</span><span class="err">/noscript&gt;     </span>
</pre></div>

<!--block_code_end-->
<h2 id="toc_2">语法</h2>

<h3 id="toc_3">标识符 - 重点,要能随时背出来</h3>

<p class="md_block">
    <span class="md_line">所谓标识符,就是指变量,函数,属性,或函数参数的名字,支持字母(A-Za-z),数字(0-9),下划线(_) 与美元符号($)组成.首字母不能是数字,用能用关键字或保留字,区分大小写.</span>
</p>


<h3 id="toc_4">注释 - 重点</h3>

<p class="md_block">
    <span class="md_line">有两种:单行 <code>//</code>   块注释: <code>/*开始  结束*/</code> </span>
</p>


<h3 id="toc_5">变量 - 重点</h3>

<p class="md_block">
    <span class="md_line">//第一种申明变量方法:</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="mi">10</span><span class="p">;</span>
<span class="nx">alert</span><span class="p">(</span><span class="nx">a</span><span class="p">);</span>
<span class="kd">var</span> <span class="nx">b</span> <span class="o">=</span> <span class="s2">&quot;霍德明&quot;</span><span class="p">;</span>
<span class="nx">alert</span><span class="p">(</span><span class="nx">b</span><span class="p">);</span>
<span class="kd">var</span> <span class="nx">c</span> <span class="o">=</span> <span class="mf">12.5</span><span class="p">;</span>
<span class="nx">alert</span><span class="p">(</span><span class="nx">c</span><span class="p">);</span>
<span class="c1">//var 姓名 = &#39;霍德明&#39;;//不报错,但违返了标识符规则.</span>
<span class="c1">//alert(姓名);</span>
</pre></div>

<!--block_code_end-->
<p class="md_block">
    <span class="md_line">//第二种申明变量方法<br /></span>
    <span class="md_line">直接写: 变量名 = 值;//但不建议使用</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="c1">//不用 var  申明,忘了写也可以.</span>
<span class="nx">d</span> <span class="o">=</span> <span class="s2">&quot;我忘了写var申明变量了!&quot;</span>
<span class="nx">alert</span><span class="p">(</span><span class="nx">d</span><span class="p">);</span>
</pre></div>

<!--block_code_end-->
<h3 id="toc_6">变量无类型,可以随意赋任意类型的值</h3>

<p class="md_block">
    <span class="md_line">因为javascript是弱内型语言,数据转换也随意.</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="mi">100</span><span class="p">;</span>
<span class="nx">alert</span><span class="p">(</span><span class="nx">a</span><span class="p">);</span>
<span class="nx">a</span> <span class="o">=</span> <span class="s2">&quot;霍德明&quot;</span><span class="p">;</span>
<span class="nx">alert</span><span class="p">(</span><span class="nx">a</span><span class="p">);</span>
</pre></div>

<!--block_code_end-->
<h3 id="toc_7">数据类型 - 理解</h3>

<ol>
<li>Number类型(整数,小数)</li>
<li>Boolean类型( 只有两个值:true,false)</li>
<li>String 类型:字符串,赋值时用单引号或双引号包起来.</li>
<li>Object类型:对象</li>
<li>Undefined类型:未定义(如果申明了变量未赋值就使用,的它值是undefined类型)</li>
<li>null类型,空对象.</li>
</ol>

<h3 id="toc_8">typeof操作符 - 撑握</h3>

<p class="md_block">
    <span class="md_line">检测数据类型的.</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span>            <span class="c1">//整数或小数都是number类型</span>
            <span class="kd">var</span> <span class="nx">num</span> <span class="o">=</span> <span class="mi">100</span><span class="p">;</span>
            <span class="nx">alert</span><span class="p">(</span><span class="nx">num</span><span class="p">);</span><span class="c1">//100</span>
            <span class="nx">alert</span><span class="p">(</span><span class="k">typeof</span> <span class="nx">num</span><span class="p">);</span><span class="c1">//number</span>
            
            <span class="c1">//boolean类型,两个值:true ,false</span>
            <span class="c1">//var bool = false;</span>
            <span class="kd">var</span> <span class="nx">bool</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
            <span class="nx">alert</span><span class="p">(</span><span class="nx">bool</span><span class="p">);</span><span class="c1">//true</span>
            <span class="nx">alert</span><span class="p">(</span><span class="k">typeof</span> <span class="nx">bool</span><span class="p">);</span><span class="c1">//boolean</span>

            <span class="c1">//string类型,赋值时用单引号或双引号都一样</span>
            <span class="c1">//var str = &#39;huodeming&#39;;</span>
            <span class="kd">var</span> <span class="nx">str</span> <span class="o">=</span> <span class="s2">&quot;huodeming&quot;</span><span class="p">;</span>
            <span class="nx">alert</span><span class="p">(</span><span class="nx">str</span><span class="p">);</span><span class="c1">//huodeming</span>
            <span class="nx">alert</span><span class="p">(</span><span class="k">typeof</span> <span class="nx">str</span><span class="p">);</span><span class="c1">//string  </span>
            
            <span class="c1">//object(对象)类型          </span>
            <span class="c1">//var obj = Object();</span>
            <span class="c1">//var obj = new Object();</span>
            <span class="kd">var</span> <span class="nx">obj</span> <span class="o">=</span> <span class="p">{};</span>
            <span class="nx">alert</span><span class="p">(</span><span class="nx">obj</span><span class="p">);</span><span class="c1">//[object Object]</span>
            <span class="nx">alert</span><span class="p">(</span><span class="k">typeof</span> <span class="nx">obj</span><span class="p">);</span><span class="c1">//object  </span>
            
            <span class="c1">//未定义undefined:在申明了变量不赋值时是未定义类型</span>
            <span class="kd">var</span> <span class="nx">a</span><span class="p">;</span>
            <span class="nx">alert</span><span class="p">(</span><span class="nx">a</span><span class="p">);</span><span class="c1">//undefined</span>
            <span class="nx">alert</span><span class="p">(</span><span class="k">typeof</span> <span class="nx">a</span><span class="p">);</span><span class="c1">//undefined</span>
            
            <span class="c1">// null空类型</span>
            <span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span>
            <span class="nx">alert</span><span class="p">(</span><span class="nx">a</span><span class="p">);</span><span class="c1">//null</span>
            <span class="nx">alert</span><span class="p">(</span><span class="k">typeof</span> <span class="nx">a</span><span class="p">);</span><span class="c1">//object</span>
</pre></div>

<!--block_code_end-->
<h3 id="toc_9">语言赋值特点</h3>
<div class="codehilite code_lang_javascript  highlight"><pre><span></span>            <span class="c1">//赋值的特点</span>
            <span class="c1">//number类型</span>
            <span class="c1">//var a = 100;</span>
            <span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="mf">100.0</span><span class="p">;</span><span class="c1">//自动去掉后面无效的0</span>
            <span class="nx">alert</span><span class="p">(</span><span class="nx">a</span><span class="p">);</span><span class="c1">//100</span>
            
            <span class="c1">//八进制问题</span>
            <span class="kd">var</span> <span class="nx">b</span> <span class="o">=</span> <span class="mi">057</span><span class="p">;</span>
            <span class="nx">alert</span><span class="p">(</span><span class="nx">b</span><span class="p">);</span><span class="c1">//47:0开头默认表示8进制.</span>
            <span class="nx">b</span> <span class="o">=</span> <span class="mi">059</span><span class="p">;</span>
            <span class="nx">alert</span><span class="p">(</span><span class="nx">b</span><span class="p">);</span><span class="c1">//59:虽然0开头默认表示8进制.但如果里面有8或9则认为是10进制</span>
            
            <span class="c1">//十六进制</span>
            <span class="kd">var</span> <span class="nx">c</span> <span class="o">=</span> <span class="mh">0xff</span><span class="p">;</span>
            <span class="nx">c</span> <span class="o">=</span> <span class="mi">0</span><span class="nx">Xff</span><span class="p">;</span>
            <span class="nx">alert</span><span class="p">(</span><span class="nx">c</span><span class="p">);</span><span class="c1">//255</span>
            
            <span class="c1">//字符串赋值双引号与单引号使用完全一样</span>
            <span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="s2">&quot;你就是一个\&quot;人\&quot;&quot;</span><span class="p">;</span>
            <span class="nx">alert</span><span class="p">(</span><span class="nx">a</span><span class="p">);</span>
            <span class="cm">/*字符串特殊字符(转义字符)</span>
<span class="cm">                \t 制表符</span>
<span class="cm">                \n 换行符</span>
<span class="cm">                \&#39;  单引号</span>
<span class="cm">                \&quot; 双引号</span>
<span class="cm">                \r 回车</span>
<span class="cm">                \u8865  表示一个unicode编码字符:补</span>
<span class="cm">            */</span>
</pre></div>

<!--block_code_end-->
<h3 id="toc_10">数据类型转换</h3>

<p class="md_block">
    <span class="md_line">转成字符串(string)类型</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span>            <span class="c1">//var a = 100;</span>
            <span class="c1">//alert(typeof a);//number</span>
            <span class="c1">//var b = a.toString();</span>
            <span class="c1">//alert(b);//100</span>
            <span class="c1">//alert(typeof b);//string</span>
            
            <span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="kc">true</span><span class="p">;</span>
            <span class="nx">alert</span><span class="p">(</span><span class="k">typeof</span> <span class="nx">a</span><span class="p">);</span><span class="c1">//boolean</span>
            <span class="kd">var</span> <span class="nx">b</span> <span class="o">=</span> <span class="nx">a</span><span class="p">.</span><span class="nx">toString</span><span class="p">();</span>
            <span class="nx">alert</span><span class="p">(</span><span class="nx">b</span><span class="p">);</span><span class="c1">//true</span>
            <span class="nx">alert</span><span class="p">(</span><span class="k">typeof</span> <span class="nx">b</span><span class="p">);</span><span class="c1">//string</span>
</pre></div>

<!--block_code_end-->
<p class="md_block">
    <span class="md_line">转number类型:Number(),parseInt(),parseFloat()</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="c1">//如果把boolean用Number()转换成数字,则是0,1</span>
            <span class="cm">/*</span>
<span class="cm">            var a = false;</span>
<span class="cm">            var b = Number(a);</span>
<span class="cm">            alert(b);//true:1   false:0</span>
<span class="cm">            alert(typeof b);//number</span>
<span class="cm">            */</span>
            
            <span class="c1">//var a = &quot;123abcde&quot;;</span>
            <span class="c1">//var b = Number(a);</span>
            <span class="c1">//alert(b);//NaN:不是个数字(类型)</span>
            
            <span class="c1">//parseInt函数只能转换字符串为整数.它进行从左到右逐位智能识别</span>
            <span class="c1">//var b = parseInt(a);</span>
            <span class="c1">//alert(b);</span>
            <span class="c1">//alert(typeof b);</span>
        <span class="c1">//parseFloat()//转字符串为小数,用法参见上面几行代码  </span>
</pre></div>

<!--block_code_end-->
<p class="md_block">
    <span class="md_line">转boolean类型</span>
</p>

<table>
 <thead><tr><th style="text-align:left">数据类型</th>
<th style="text-align:left">转换为true的值</th>
<th style="text-align:left">转换为false的值</th>
 </tr>
</thead>
 <tbody><tr><td style="text-align:left">boolean </td>
<td style="text-align:left"> true </td>
<td style="text-align:left"> false</td>
</tr>
<tr><td style="text-align:left">String </td>
<td style="text-align:left"> 任何非空字符串 </td>
<td style="text-align:left"> 空字符串</td>
</tr>
<tr><td style="text-align:left">Number </td>
<td style="text-align:left"> 任意非0的数字 </td>
<td style="text-align:left"> 0 与 NaN</td>
</tr>
<tr><td style="text-align:left">Object </td>
<td style="text-align:left"> 任意对象   </td>
<td style="text-align:left"> null</td>
</tr>
<tr><td style="text-align:left">undefined</td>
<td style="text-align:left"> </td>
<td style="text-align:left">undefined</td>
</tr>
</tbody> 
</table>
<!--block_code_end--><div class="codehilite code_lang_javascript  highlight"><pre><span></span>            <span class="c1">//var a = 0.5;//非0数字能识别成true.</span>
            <span class="c1">//var a = 5/0*0;//NaN转 number失败或0做为除数时,本来程序应出错.但js规定返回NaN类型.它能转成false</span>
            <span class="c1">//alert(a);</span>
            <span class="c1">//var a;//undefined是false</span>
            <span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="kc">null</span><span class="p">;</span><span class="c1">//false</span>
            <span class="c1">//var a = &quot;&quot;;//非空字符串都识别成true.</span>
            <span class="k">if</span><span class="p">(</span><span class="nx">a</span><span class="p">){</span>
                <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;true&quot;</span><span class="p">);</span>
            <span class="p">}</span><span class="k">else</span><span class="p">{</span>
                <span class="nx">alert</span><span class="p">(</span><span class="kc">false</span><span class="p">);</span>
            <span class="p">}</span>        
</pre></div>

<!--block_code_end-->
<h2 id="toc_11">运算符</h2>

<h3 id="toc_12">算术运算符</h3>

<p class="md_block">
    <span class="md_line">二元:+ - * / %</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="s2">&quot;10&quot;</span> <span class="o">+</span> <span class="s2">&quot;3&quot;</span><span class="p">;</span><span class="c1">//+运算符另一用法:连接字符串  (当一边是数字类型,另一边不是数字时会进行字符串连接)</span>
<span class="nx">alert</span><span class="p">(</span><span class="nx">a</span><span class="p">);</span>
</pre></div>

<!--block_code_end-->
<p class="md_block">
    <span class="md_line">一元: ++  --</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="mi">10</span><span class="p">;</span>
<span class="kd">var</span> <span class="nx">b</span> <span class="o">=</span> <span class="o">++</span><span class="nx">a</span><span class="p">;</span><span class="c1">//b = 11,a = 11;</span>
<span class="nx">b</span> <span class="o">=</span> <span class="nx">a</span><span class="o">++</span><span class="p">;</span><span class="c1">//b = 11,a = 12</span>
<span class="c1">//如果理解不了,把++或--写在单独一行.</span>
            <span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="mi">10</span><span class="p">;</span>
            <span class="kd">var</span> <span class="nx">b</span> <span class="o">=</span> <span class="nx">a</span><span class="p">;</span>
            <span class="nx">a</span><span class="o">++</span><span class="p">;</span>
</pre></div>

<!--block_code_end-->
<h3 id="toc_13">赋值运算符</h3>

<p class="md_block">
    <span class="md_line">=   +=  -=  /=  *=  %=</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="c1">//注意+=运算符:与加法一样,如果一边是字符串时,进行字符串连接.</span>
</pre></div>

<!--block_code_end-->
<h3 id="toc_14">比较(关系)运算符</h3>

<p class="md_block">
    <span class="md_line">==  &gt;   &lt;   &gt;=  &lt;=  !=  ===</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="kd">var</span> <span class="nx">bool</span> <span class="o">=</span> <span class="mi">10</span> <span class="o">===</span> <span class="s2">&quot;10&quot;</span><span class="p">;</span><span class="c1">//全等于(恒等于) 判断的值相等,同时数据类型也要相同</span>
</pre></div>

<!--block_code_end-->
<h3 id="toc_15">逻辑运算符</h3>

<p class="md_block">
    <span class="md_line">&amp;&amp;  ||  !<br /></span>
    <span class="md_line">&amp;&amp; :多条件判断时使用,所有判断必须返全回真,结果才是真,只要有一个是假,则返回假<br /></span>
    <span class="md_line">||:多条件判断时便用.所有判都返回假,结果才是假,只要有一个返回真,则返回真<br /></span>
    <span class="md_line">    ! 在判断结果前面加! 表示取反,真则为假,假则为真.</span>
</p>


<h2 id="toc_16">运算符综合实例(写一个简单计算器)</h2>
<div class="codehilite code_lang_html  highlight"><pre><span></span><span class="cp">&lt;!DOCTYPE html&gt;</span>
<span class="p">&lt;</span><span class="nt">html</span><span class="p">&gt;</span>
    <span class="p">&lt;</span><span class="nt">head</span><span class="p">&gt;</span>
        <span class="p">&lt;</span><span class="nt">meta</span> <span class="na">charset</span><span class="o">=</span><span class="s">&quot;UTF-8&quot;</span><span class="p">&gt;</span>
        <span class="p">&lt;</span><span class="nt">title</span><span class="p">&gt;</span>简单计算器<span class="p">&lt;/</span><span class="nt">title</span><span class="p">&gt;</span>
        <span class="p">&lt;</span><span class="nt">script</span> <span class="na">type</span><span class="o">=</span><span class="s">&quot;text/javascript&quot;</span><span class="p">&gt;</span>
            <span class="c1">//思路:1.必须用控件注册事件与函数关联起来.</span>
            
            <span class="kd">function</span> <span class="nx">jisuan1</span><span class="p">(){</span>
                <span class="kd">var</span> <span class="nx">num1</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="s2">&quot;num1&quot;</span><span class="p">).</span><span class="nx">value</span><span class="p">;</span><span class="c1">//通过ID属性获取HTML组件的值.</span>
                <span class="kd">var</span> <span class="nx">num2</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="s2">&quot;num2&quot;</span><span class="p">).</span><span class="nx">value</span><span class="p">;</span>
                <span class="c1">//获取的值都是string类型,需要转换成number类型</span>
                <span class="nx">num1</span> <span class="o">=</span> <span class="nb">Number</span><span class="p">(</span><span class="nx">num1</span><span class="p">);</span>
                <span class="nx">num2</span> <span class="o">=</span> <span class="nb">Number</span><span class="p">(</span><span class="nx">num2</span><span class="p">);</span>
                <span class="c1">//判断一下两个值是否合法(是不是数字)</span>
                <span class="k">if</span><span class="p">(</span><span class="nb">isNaN</span><span class="p">(</span><span class="nx">num1</span><span class="p">)</span> <span class="o">||</span> <span class="nb">isNaN</span><span class="p">(</span><span class="nx">num2</span><span class="p">)){</span>
                    <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;输入的数据不合法!&quot;</span><span class="p">);</span>
                <span class="p">}</span><span class="k">else</span><span class="p">{</span>
                    <span class="c1">//计算出来结果</span>
                    <span class="kd">var</span> <span class="nx">num3</span> <span class="o">=</span> <span class="nx">num1</span><span class="o">+</span><span class="nx">num2</span><span class="p">;</span>
                    <span class="c1">//把值显示在计算结果中.</span>
                    <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="s2">&quot;num3&quot;</span><span class="p">).</span><span class="nx">value</span> <span class="o">=</span> <span class="nx">num3</span><span class="p">;</span>
                <span class="p">}</span>
            <span class="p">}</span>
            <span class="kd">function</span> <span class="nx">jisuan2</span><span class="p">(){</span>
                <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;按了-&quot;</span><span class="p">);</span>
            <span class="p">}</span>
            <span class="kd">function</span> <span class="nx">jisuan3</span><span class="p">(){</span>
                <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;按了*&quot;</span><span class="p">);</span>
            <span class="p">}</span>
            <span class="kd">function</span> <span class="nx">jisuan4</span><span class="p">(){</span>
                <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;按了/&quot;</span><span class="p">);</span>
            <span class="p">}</span>

        <span class="p">&lt;/</span><span class="nt">script</span><span class="p">&gt;</span>
        
    <span class="p">&lt;/</span><span class="nt">head</span><span class="p">&gt;</span>
    <span class="p">&lt;</span><span class="nt">body</span><span class="p">&gt;</span>
        第一个数:<span class="p">&lt;</span><span class="nt">input</span> <span class="na">type</span><span class="o">=</span><span class="s">&quot;text&quot;</span> <span class="na">id</span><span class="o">=</span><span class="s">&quot;num1&quot;</span> <span class="na">value</span><span class="o">=</span><span class="s">&quot;&quot;</span> <span class="p">/&gt;&lt;</span><span class="nt">br</span> <span class="p">/&gt;</span>
        第二个数:<span class="p">&lt;</span><span class="nt">input</span> <span class="na">type</span><span class="o">=</span><span class="s">&quot;text&quot;</span> <span class="na">id</span><span class="o">=</span><span class="s">&quot;num2&quot;</span> <span class="na">value</span><span class="o">=</span><span class="s">&quot;&quot;</span> <span class="p">/&gt;&lt;</span><span class="nt">br</span> <span class="p">/&gt;</span>
        
        <span class="p">&lt;</span><span class="nt">input</span> <span class="na">type</span><span class="o">=</span><span class="s">&quot;button&quot;</span> <span class="na">name</span><span class="o">=</span><span class="s">&quot;&quot;</span> <span class="na">id</span><span class="o">=</span><span class="s">&quot;&quot;</span> <span class="na">value</span><span class="o">=</span><span class="s">&quot;    +   &quot;</span> <span class="na">onclick</span><span class="o">=</span><span class="s">&quot;jisuan1()&quot;</span><span class="p">/&gt;</span>
        <span class="p">&lt;</span><span class="nt">input</span> <span class="na">type</span><span class="o">=</span><span class="s">&quot;button&quot;</span> <span class="na">name</span><span class="o">=</span><span class="s">&quot;&quot;</span> <span class="na">id</span><span class="o">=</span><span class="s">&quot;&quot;</span> <span class="na">value</span><span class="o">=</span><span class="s">&quot;    -   &quot;</span> <span class="na">onclick</span><span class="o">=</span><span class="s">&quot;jisuan2()&quot;</span><span class="p">/&gt;</span>
        <span class="p">&lt;</span><span class="nt">input</span> <span class="na">type</span><span class="o">=</span><span class="s">&quot;button&quot;</span> <span class="na">name</span><span class="o">=</span><span class="s">&quot;&quot;</span> <span class="na">id</span><span class="o">=</span><span class="s">&quot;&quot;</span> <span class="na">value</span><span class="o">=</span><span class="s">&quot;    *   &quot;</span> <span class="na">onclick</span><span class="o">=</span><span class="s">&quot;jisuan3()&quot;</span><span class="p">/&gt;</span>
        <span class="p">&lt;</span><span class="nt">input</span> <span class="na">type</span><span class="o">=</span><span class="s">&quot;button&quot;</span> <span class="na">name</span><span class="o">=</span><span class="s">&quot;&quot;</span> <span class="na">id</span><span class="o">=</span><span class="s">&quot;&quot;</span> <span class="na">value</span><span class="o">=</span><span class="s">&quot;    /   &quot;</span> <span class="na">onclick</span><span class="o">=</span><span class="s">&quot;jisuan4()&quot;</span><span class="p">/&gt;</span>
        <span class="p">&lt;</span><span class="nt">hr</span> <span class="p">/&gt;</span>
        计算结果:<span class="p">&lt;</span><span class="nt">input</span> <span class="na">type</span><span class="o">=</span><span class="s">&quot;text&quot;</span> <span class="na">id</span><span class="o">=</span><span class="s">&quot;num3&quot;</span> <span class="na">value</span><span class="o">=</span><span class="s">&quot;&quot;</span> <span class="p">/&gt;&lt;</span><span class="nt">br</span> <span class="p">/&gt;</span>
    <span class="p">&lt;/</span><span class="nt">body</span><span class="p">&gt;</span>
<span class="p">&lt;/</span><span class="nt">html</span><span class="p">&gt;</span>
</pre></div>

<!--block_code_end-->
<h2 id="toc_17">if条件结构</h2>

<p class="md_block">
    <span class="md_line">单如果:    if(条件){}<br /></span>
    <span class="md_line">如果...否则:    if(条件){}else{}<br /></span>
    <span class="md_line">如果...否则如果.....否则:if(条件){}else if(条件){}...else{}<br /></span>
    <span class="md_line">上面三个语句,if是必写,else 与 else if都是可选的.不写也行.else if可以是多个...但else只能出现一次且在最后.</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span>            <span class="c1">//单如果语句</span>
            <span class="k">if</span><span class="p">(</span><span class="mi">10</span><span class="o">&gt;</span><span class="mi">5</span><span class="p">){</span>
                <span class="nx">alert</span><span class="p">(</span><span class="s1">&#39;1条件判断为true&#39;</span><span class="p">);</span>
            <span class="p">}</span>
            <span class="c1">//如果...否则....</span>
            <span class="k">if</span><span class="p">(</span><span class="mi">10</span><span class="o">&gt;</span><span class="mi">50</span><span class="p">){</span>
                <span class="nx">alert</span><span class="p">(</span><span class="s1">&#39;2条件判断为true&#39;</span><span class="p">);</span>
            <span class="p">}</span><span class="k">else</span><span class="p">{</span>
                <span class="nx">alert</span><span class="p">(</span><span class="s1">&#39;2条件判断为false&#39;</span><span class="p">);</span>
            <span class="p">}</span>
         <span class="c1">//如果...否则如果...否则```javascript</span>
            <span class="k">if</span><span class="p">(</span><span class="mi">10</span><span class="o">&gt;</span><span class="mi">50</span><span class="p">){</span>
                <span class="nx">alert</span><span class="p">(</span><span class="s1">&#39;3-1条件判断为true&#39;</span><span class="p">);</span>
            <span class="p">}</span><span class="k">else</span> <span class="k">if</span><span class="p">(</span><span class="mi">10</span> <span class="o">==</span> <span class="mi">11</span><span class="p">){</span>
                <span class="nx">alert</span><span class="p">(</span><span class="s1">&#39;3-2条件判断为true&#39;</span><span class="p">);</span>
            <span class="p">}</span><span class="k">else</span> <span class="k">if</span><span class="p">(</span><span class="mi">10</span> <span class="o">==</span> <span class="s1">&#39;10&#39;</span><span class="p">){</span>
                <span class="nx">alert</span><span class="p">(</span><span class="s1">&#39;3-3条件判断为true&#39;</span><span class="p">);</span>
            <span class="p">}</span><span class="k">else</span><span class="p">{</span>
                <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;3-4以上条件都不成立,进入了否则!&quot;</span><span class="p">);</span>
            <span class="p">}</span>
</pre></div>

<!--block_code_end-->
<p class="md_block">
    <span class="md_line">switch() case:语句</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span>            <span class="kd">var</span> <span class="nx">a</span><span class="p">;</span><span class="c1">// = 1;//0-6表示星期天 - 星期六</span>
            <span class="nx">a</span> <span class="o">=</span> <span class="nx">prompt</span><span class="p">(</span><span class="s1">&#39;请输入星期的第几天(0-6)&#39;</span><span class="p">);</span><span class="c1">//弹框接收用户输入给变量赋值</span>
            <span class="nx">a</span> <span class="o">=</span> <span class="nb">Number</span><span class="p">(</span><span class="nx">a</span><span class="p">);</span>
            
            <span class="k">switch</span><span class="p">(</span><span class="nx">a</span><span class="p">){</span>
                <span class="k">case</span> <span class="mi">0</span><span class="o">:</span>
                    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s1">&#39;星期天&#39;</span><span class="p">);</span>
                    <span class="k">break</span><span class="p">;</span><span class="c1">//跳出switch语句.</span>
                <span class="k">case</span> <span class="mi">1</span><span class="o">:</span>
                    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s1">&#39;星期一&#39;</span><span class="p">);</span>
                    <span class="k">break</span><span class="p">;</span>
                <span class="k">case</span> <span class="mi">2</span><span class="o">:</span>
                    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s1">&#39;星期二&#39;</span><span class="p">);</span>
                    <span class="k">break</span><span class="p">;</span>
                <span class="k">case</span> <span class="mi">3</span><span class="o">:</span>
                    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s1">&#39;星期三&#39;</span><span class="p">);</span>
                    <span class="k">break</span><span class="p">;</span>
                <span class="k">case</span> <span class="mi">4</span><span class="o">:</span>
                    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s1">&#39;星期四&#39;</span><span class="p">);</span>
                    <span class="k">break</span><span class="p">;</span>
                <span class="k">case</span> <span class="mi">5</span><span class="o">:</span>
                    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s1">&#39;星期五&#39;</span><span class="p">);</span>
                    <span class="k">break</span><span class="p">;</span>
                <span class="k">case</span> <span class="mi">6</span><span class="o">:</span>
                    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s1">&#39;星期六&#39;</span><span class="p">);</span>
                    <span class="k">break</span><span class="p">;</span>
                <span class="k">default</span><span class="o">:</span><span class="c1">//如果上面都不对,则执行 default是可选的.</span>
                    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s1">&#39;你的输入有误!&#39;</span><span class="p">);</span>
                    <span class="k">break</span><span class="p">;</span>
                <span class="p">}</span>
                <span class="c1">//===========================</span>
                            <span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="nx">prompt</span><span class="p">(</span><span class="s1">&#39;请输入星期的第几天(0-6)&#39;</span><span class="p">);</span>
            <span class="nx">a</span> <span class="o">=</span> <span class="nb">Number</span><span class="p">(</span><span class="nx">a</span><span class="p">);</span>
            <span class="k">switch</span><span class="p">(</span><span class="nx">a</span><span class="p">){</span>
                <span class="k">case</span> <span class="mi">0</span><span class="o">:</span>
                <span class="k">case</span> <span class="mi">6</span><span class="o">:</span>
                    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s2">&quot;睡大觉&quot;</span><span class="p">);</span>
                    <span class="k">break</span><span class="p">;</span><span class="c1">//如果不写break;会惯穿下一个case</span>
                <span class="k">case</span> <span class="mi">1</span><span class="o">:</span>
                <span class="k">case</span> <span class="mi">2</span><span class="o">:</span>
                <span class="k">case</span> <span class="mi">3</span><span class="o">:</span>
                <span class="k">case</span> <span class="mi">4</span><span class="o">:</span>
                    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s2">&quot;好好学习与工作&quot;</span><span class="p">);</span>
                    <span class="k">break</span><span class="p">;</span>
                <span class="k">case</span> <span class="mi">5</span><span class="o">:</span>
                    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s2">&quot;我的心情你不懂&quot;</span><span class="p">);</span>
                    <span class="k">break</span><span class="p">;</span>
                <span class="k">default</span><span class="o">:</span>
                    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s2">&quot;地球人的星期只有7天&quot;</span><span class="p">);</span>
            <span class="p">}</span>
                
</pre></div>

<!--block_code_end-->
<h2 id="toc_18">循环语句</h2>

<p class="md_block">
    <span class="md_line">while</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span>
<span class="k">while</span><span class="p">(</span><span class="nx">i</span> <span class="o">&lt;</span> <span class="mi">10</span><span class="p">){</span>
    <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;第&quot;</span><span class="o">+</span><span class="nx">i</span><span class="o">+</span><span class="s2">&quot;次循环!&quot;</span><span class="p">);</span>
    <span class="nx">i</span><span class="o">++</span><span class="p">;</span>
<span class="p">}</span>
</pre></div>

<!--block_code_end-->
<p class="md_block">
    <span class="md_line">do...while</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s2">&quot;&lt;pre&gt;&quot;</span><span class="p">);</span>
<span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span>
<span class="k">do</span><span class="p">{</span>
    <span class="nb">document</span><span class="p">.</span><span class="nx">writeln</span><span class="p">(</span><span class="s2">&quot;第&quot;</span><span class="o">+</span><span class="nx">i</span><span class="o">+</span><span class="s2">&quot;次循环!&quot;</span><span class="p">);</span><span class="c1">//写入HTML文档并换行</span>
<span class="p">}</span><span class="k">while</span><span class="p">(</span><span class="nx">i</span><span class="o">++</span> <span class="o">&lt;</span> <span class="mi">10</span><span class="p">);</span>
<span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s2">&quot;&lt;pre&gt;&quot;</span><span class="p">);</span>
</pre></div>

<!--block_code_end-->
<p class="md_block">
    <span class="md_line">for</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s2">&quot;&lt;pre&gt;&quot;</span><span class="p">);</span>
<span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span><span class="p">;</span> <span class="nx">i</span><span class="o">&lt;</span> <span class="mi">10</span><span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">){</span>
    <span class="nb">document</span><span class="p">.</span><span class="nx">writeln</span><span class="p">(</span><span class="s2">&quot;第&quot;</span><span class="o">+</span><span class="nx">i</span><span class="o">+</span><span class="s2">&quot;次循环!&quot;</span><span class="p">);</span><span class="c1">//写入HTML文档并换行</span>
<span class="p">}</span>
<span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s2">&quot;&lt;/pre&gt;&quot;</span><span class="p">);</span>
</pre></div>

<!--block_code_end-->
<p class="md_block">
    <span class="md_line">for-in循环</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="c1">//for-in循环,后面详细讲解,在这熟悉下</span>
<span class="kd">var</span> <span class="nx">obj</span> <span class="o">=</span> <span class="p">[</span><span class="s2">&quot;aa&quot;</span><span class="p">,</span><span class="s2">&quot;bb&quot;</span><span class="p">,</span><span class="s2">&quot;cc&quot;</span><span class="p">,</span><span class="s2">&quot;dd&quot;</span><span class="p">,</span><span class="s2">&quot;ee&quot;</span><span class="p">,</span><span class="s1">&#39;ff&#39;</span><span class="p">,</span><span class="s2">&quot;gg&quot;</span><span class="p">];</span>
<span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">a</span> <span class="k">in</span> <span class="nx">obj</span><span class="p">){</span><span class="c1">//遍历数组</span>
    <span class="nx">alert</span><span class="p">(</span><span class="nx">obj</span><span class="p">[</span><span class="nx">a</span><span class="p">]);</span>
<span class="p">}</span>
<span class="c1">//===========================</span>
<span class="kd">var</span> <span class="nx">obj</span> <span class="o">=</span> <span class="k">new</span> <span class="nb">Object</span><span class="p">();</span>
<span class="nx">obj</span><span class="p">.</span><span class="nx">aa</span> <span class="o">=</span> <span class="mi">10</span><span class="p">;</span>
<span class="nx">obj</span><span class="p">.</span><span class="nx">bb</span> <span class="o">=</span> <span class="mi">20</span><span class="p">;</span>
<span class="nx">obj</span><span class="p">.</span><span class="nx">cc</span> <span class="o">=</span> <span class="mi">30</span><span class="p">;</span>
<span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">a</span> <span class="k">in</span> <span class="nx">obj</span><span class="p">){</span><span class="c1">//遍历对象</span>
    <span class="nx">alert</span><span class="p">(</span><span class="nx">obj</span><span class="p">[</span><span class="nx">a</span><span class="p">]);</span>
<span class="p">}</span>
</pre></div>

<!--block_code_end-->
<h2 id="toc_19">函数</h2>
<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="c1">//函数学习</span>

<span class="c1">//1.没有参数的函数</span>

<span class="kd">function</span> <span class="nx">fun</span><span class="p">(){</span>
    <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;这个函数被执行了!&quot;</span><span class="p">);</span>
<span class="p">}</span>
<span class="c1">//调用无参数的函数</span>
<span class="c1">//fun();</span>

<span class="c1">//2.带参数的函数</span>
<span class="kd">function</span> <span class="nx">fun1</span><span class="p">(</span><span class="nx">name</span><span class="p">,</span><span class="nx">age</span><span class="p">){</span>
    <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;姓名是:&quot;</span><span class="o">+</span><span class="nx">name</span><span class="o">+</span><span class="s2">&quot;,年龄是:&quot;</span><span class="o">+</span><span class="nx">age</span><span class="p">);</span>
    
<span class="p">}</span>
<span class="c1">//调用有参数的函数</span>
<span class="c1">//fun1(&quot;huodeming&quot;,18);</span>

<span class="c1">//3.有返回值的函数</span>
<span class="kd">function</span> <span class="nx">fun2</span><span class="p">(){</span>
    <span class="k">return</span> <span class="s2">&quot;我是返回值!是字符串&quot;</span><span class="p">;</span>
<span class="p">}</span>
<span class="c1">//调用有返回值的函数:返回值要用变量来接收.</span>
<span class="c1">//var str = fun2();</span>
<span class="c1">//alert(str);</span>

<span class="c1">//4.匿名函数(自我调用) - 了解</span>
<span class="cm">/*</span>
<span class="cm">(function(name,age){</span>
<span class="cm">    alert(&quot;我没有名字,你调用不到我! 其实我有两参数:&quot;+name+age);</span>
<span class="cm">})(&#39;我的名字&#39;,18);</span>
<span class="cm">*/</span>

<span class="c1">//5.变量函数 - 了解</span>
<span class="kd">var</span> <span class="nx">fun3</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span>
    <span class="c1">//alert(&quot;我没有名字,你调用不到我,但你可以通过变量调用我&quot;);</span>
    <span class="k">return</span> <span class="s2">&quot;我没有名字,你调用不到我,但你可以通过变量调用我&quot;</span><span class="p">;</span>
<span class="p">}</span>
<span class="c1">//调用变量函数</span>
<span class="c1">//alert(  fun3()   );</span>

<span class="c1">//6.参数(arguments对象) - 了解</span>
<span class="kd">function</span> <span class="nx">fun4</span><span class="p">(){</span>
    <span class="nx">alert</span><span class="p">(</span><span class="nx">arguments</span><span class="p">.</span><span class="nx">length</span><span class="p">);</span><span class="c1">//arguments对象,获取参数列表.</span>
    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="nx">arguments</span><span class="p">[</span><span class="mi">2</span><span class="p">]);</span>
<span class="p">}</span>
<span class="nx">fun4</span><span class="p">(</span><span class="mi">18</span><span class="p">,</span><span class="mi">19</span><span class="p">,</span><span class="mi">20</span><span class="p">);</span>
</pre></div>

<!--block_code_end-->
<h2 id="toc_20">常用系统函数</h2>

<p class="md_block">
    <span class="md_line">isNaN():检查某个值是否是数字。 <br /></span>
    <span class="md_line">Number():把对象的值转换为数字。 <br /></span>
    <span class="md_line">parseFloat():解析一个字符串并返回一个浮点数。(参数只参是字符串) <br /></span>
    <span class="md_line">parseInt():解析一个字符串并返回一个整数。(参数只参是字符串)<br><br /></span>
    <span class="md_line">eval() 计算 JavaScript 字符串，并把它作为脚本代码来执行。</span>
</p>

<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="c1">//把字符串转换成可执行的javascript代码并执行它.</span>
<span class="kd">var</span> <span class="nx">a</span> <span class="o">=</span> <span class="s1">&#39;var a = 100;alert(a)&#39;</span><span class="p">;</span>
<span class="nb">eval</span><span class="p">(</span><span class="nx">a</span><span class="p">);</span>
</pre></div>

<!--block_code_end-->
<h3 id="toc_21">数组</h3>
<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="c1">//申明数组(集合)</span>
<span class="c1">//var arr = Array(10,20,&#39;abc&#39;,&#39;中国&#39;,true);</span>
<span class="c1">//var arr = new Array(10,20,&#39;abc&#39;,&#39;中国&#39;,false);</span>
<span class="c1">//var arr = new Array(5);//如果参数是一个整数且只有一个数字时,它就是元素的个数</span>
<span class="kd">var</span> <span class="nx">arr</span> <span class="o">=</span> <span class="p">[</span><span class="mi">10</span><span class="p">,</span><span class="mi">20</span><span class="p">,</span><span class="s1">&#39;abc&#39;</span><span class="p">,</span><span class="s1">&#39;中国&#39;</span><span class="p">,</span><span class="mi">555</span><span class="p">];</span><span class="c1">//字面量申明数组方法</span>

<span class="c1">//获取数组长度(元素的个数)</span>
<span class="kd">var</span> <span class="nx">len</span> <span class="o">=</span> <span class="nx">arr</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span>

<span class="c1">//用for循环输出数组的值</span>
<span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span> <span class="p">;</span> <span class="nx">i</span> <span class="o">&lt;</span> <span class="nx">len</span> <span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">){</span>
    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="nx">arr</span><span class="p">[</span><span class="nx">i</span><span class="p">]</span> <span class="o">+</span> <span class="s1">&#39;&lt;br /&gt;&#39;</span><span class="p">);</span>
<span class="p">}</span>
</pre></div>

<!--block_code_end-->
<h2 id="toc_22">对象</h2>
<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="c1">//Object类型</span>
<span class="c1">//var obj = Object;</span>
<span class="c1">//var obj =  Object();</span>
<span class="c1">//var obj = new Object();</span>

<span class="kd">var</span> <span class="nx">obj</span> <span class="o">=</span> <span class="p">{};</span><span class="c1">//字面量申明方法</span>

<span class="c1">//给对象创建属性</span>
<span class="nx">obj</span><span class="p">.</span><span class="nx">user</span> <span class="o">=</span> <span class="s1">&#39;huodeming&#39;</span><span class="p">;</span>
<span class="nx">obj</span><span class="p">.</span><span class="nx">age</span> <span class="o">=</span> <span class="mi">18</span><span class="p">;</span>
<span class="nx">obj</span><span class="p">.</span><span class="nx">sex</span> <span class="o">=</span> <span class="s2">&quot;男&quot;</span><span class="p">;</span>
<span class="c1">//给对象创建方法.</span>
<span class="nx">obj</span><span class="p">.</span><span class="nx">run</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(){</span>
    <span class="nx">alert</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">user</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">age</span> <span class="o">+</span> <span class="k">this</span><span class="p">.</span><span class="nx">sex</span><span class="p">);</span>
<span class="p">}</span>
<span class="c1">//调用属性</span>
<span class="nx">alert</span><span class="p">(</span><span class="nx">obj</span><span class="p">.</span><span class="nx">sex</span><span class="p">);</span>
<span class="c1">//调用方法</span>
<span class="nx">obj</span><span class="p">.</span><span class="nx">run</span><span class="p">();</span>
</pre></div>

<!--block_code_end-->
<h2 id="toc_23">课件练习:输出三角形</h2>
<div class="codehilite code_lang_javascript  highlight"><pre><span></span><span class="kd">var</span> <span class="nx">rows</span><span class="p">;</span><span class="c1">//行数</span>
<span class="nx">rows</span> <span class="o">=</span> <span class="nx">prompt</span><span class="p">(</span><span class="s2">&quot;请输入行数:&quot;</span><span class="p">,</span><span class="mi">5</span><span class="p">);</span><span class="c1">//输入行数给变量赋值,默认值为5</span>
<span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">i</span> <span class="o">=</span> <span class="mi">0</span> <span class="p">;</span> <span class="nx">i</span> <span class="o">&lt;</span> <span class="nx">rows</span> <span class="p">;</span> <span class="nx">i</span><span class="o">++</span><span class="p">){</span>
    <span class="c1">//打印每行前的空格</span>
    <span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">k</span> <span class="o">=</span> <span class="mi">0</span> <span class="p">;</span> <span class="nx">k</span> <span class="o">&lt;</span> <span class="nx">rows</span><span class="o">-</span><span class="nx">i</span><span class="o">-</span><span class="mi">1</span> <span class="p">;</span> <span class="nx">k</span><span class="o">++</span><span class="p">){</span>
        <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s1">&#39;&amp;nbsp&#39;</span><span class="p">);</span>
    <span class="p">}</span>
    <span class="c1">//打印了每行的*号</span>
    <span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">j</span> <span class="o">=</span> <span class="mi">0</span> <span class="p">;</span> <span class="nx">j</span> <span class="o">&lt;=</span> <span class="nx">i</span> <span class="p">;</span> <span class="nx">j</span><span class="o">++</span><span class="p">){</span>
        <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s1">&#39;*&amp;nbsp&#39;</span><span class="p">);</span>
    <span class="p">}</span>
    <span class="nb">document</span><span class="p">.</span><span class="nx">write</span><span class="p">(</span><span class="s1">&#39;&lt;br /&gt;&#39;</span><span class="p">);</span>
<span class="p">}</span>
</pre></div>

<!--block_code_end-->
<h2 id="toc_24">使用火狐自带的开发者工具进行调试.</h2> </div>
                </div>
            </div>

        </div>

    </div>

</div>


<script type="text/javascript" src="./asset/gitbook/app.js"></script>

<script>require(["gitbook"], function (gitbook) {
    var config = {"fontSettings": {"theme": null, "family": "sans", "size": 2}};
    gitbook.start(config);
});

</script>





</body>

</html>